﻿<Window
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
	xmlns:system="clr-namespace:System;assembly=mscorlib"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	xmlns:linqtoxml="clr-namespace:System.Xml.Linq;assembly=System.Xml.Linq"
	x:Class="LinqToXmlDataBinding.Window1"
	x:Name="Window"
	Title="Linq To Xml Data Binding"
	Width="896" Height="623" ResizeMode="NoResize" Topmost="True" WindowStyle="SingleBorderWindow" Background="{DynamicResource DefaultedBorderBrush}" FontSize="12" Foreground="#FF1523C2">

	<Window.Resources>
		<!--Defining two resources, these two use System.xml.linq's object XElement and invoke Load() with corresponding parameters-->
		<ObjectDataProvider x:Key="MsnVideosList" ObjectType="{x:Type linqtoxml:XElement}" MethodName="Load">
			<ObjectDataProvider.MethodParameters>
				<system:String>http://soapbox.msn.com/rss.aspx?listId=MostPopular</system:String>
			</ObjectDataProvider.MethodParameters>
		</ObjectDataProvider>
		<ObjectDataProvider x:Key="MyFavoritesList" ObjectType="{x:Type linqtoxml:XElement}" MethodName="Load">
			<ObjectDataProvider.MethodParameters>
				<system:String>..\..\data\MyFavorites.xml</system:String>
			</ObjectDataProvider.MethodParameters>
		</ObjectDataProvider>
		<!--Data template used with both of the list boxes to display each listbox item-->
		<DataTemplate x:Key="ItemTemplate">
			<DockPanel HorizontalAlignment="Center" RenderTransformOrigin="0.5,0.5">
				<DockPanel.Background>
					<LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
						<GradientStop Color="#FF000000" Offset="0"/>
						<GradientStop Color="#FFFFFFFF" Offset="1"/>
					</LinearGradientBrush>
				</DockPanel.Background>
				<Image Margin="10,0,0,5" Width="100" Height="80" RenderTransformOrigin="0.5,0.5" x:Name="listBoxImage">
					<Image.Source>
						<!-- Image source is bound to the attribute of thumbnail element of content element-->
						<Binding Path="Element[{http://search.yahoo.com/mrss}content].Element[{http://search.yahoo.com/mrss}thumbnail].Attribute[url].Value"/>
					</Image.Source>
					<Image.RenderTransform>
						<TransformGroup>
							<ScaleTransform ScaleX="1" ScaleY="1"/>
							<SkewTransform AngleX="0" AngleY="0"/>
							<RotateTransform Angle="-5.422"/>
							<TranslateTransform X="0" Y="0"/>
						</TransformGroup>
					</Image.RenderTransform>
				</Image>
				<TextBlock Margin="10,0,0,5" Width="150" Height="80" TextWrapping="Wrap"  Foreground="#FF162DB4" x:Name="listBoxText">
					<TextBlock.Text>
						<!-- video description element value-->
						<Binding Path="Element[{http://soapbox.msn.com/elements/2005}description].Value"/>
					</TextBlock.Text>
				</TextBlock>
			</DockPanel>
		</DataTemplate>
	</Window.Resources>

	<Grid x:Name="LayoutRoot">
		<TabControl RenderTransformOrigin="0.5,0.5" x:Name="tabControl" Style="{DynamicResource SimpleTabControl}" IsSynchronizedWithCurrentItem="True" Margin="0,0,0,-2">
			<TabControl.Background>
				<LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
					<GradientStop Color="#FF000000" Offset="0"/>
					<GradientStop Color="#FFF5F5F5" Offset="1"/>
				</LinearGradientBrush>
			</TabControl.Background>
			<TabControl.Foreground>
				<LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
					<GradientStop Color="#FF000000" Offset="0"/>
					<GradientStop Color="#FFFDFDFD" Offset="1"/>
				</LinearGradientBrush>
			</TabControl.Foreground>
			<!-- -->
			<TabItem x:Name="tabItemOne" Style="{DynamicResource SimpleTabItem}" Header="Soapbox on MSN Video">
				<!-- Stack panel uses resource "MsnVideosList" defined earlier and binds to descendants elements with the name "item"-->
				<StackPanel x:Name="stackPanelOne" Background="{DynamicResource DefaultedBorderBrush}" DataContext="{Binding Path=Descendants[item], Source={StaticResource MsnVideosList}}">
					<Canvas x:Name="canvasOne" Width="870" Height="573">
						<Image x:Name="msnLogo1" Width="Auto" Height="Auto" Canvas.Left="58" Canvas.Top="22.83" Source="msn_b.gif" RenderTransformOrigin="0.5,0.5">
							<Image.RenderTransform>
								<TransformGroup>
									<ScaleTransform ScaleX="1" ScaleY="1"/>
									<SkewTransform AngleX="0" AngleY="0"/>
									<RotateTransform Angle="0"/>
									<TranslateTransform X="0" Y="0"/>
								</TransformGroup>
							</Image.RenderTransform>
						</Image>
						<TextBox HorizontalAlignment="Center" x:Name="searchBox" VerticalAlignment="Center" Width="280" Height="28.96" Text="Microsoft" TextWrapping="Wrap" Canvas.Left="332.5"
								 Canvas.Top="16" Background="{DynamicResource {x:Static SystemColors.InfoBrushKey}}" BorderBrush="{DynamicResource {x:Static SystemColors.InfoBrushKey}}"
								 FontFamily="Comic Sans MS" FontSize="14" KeyUp="OnKeyUp">
							<TextBox.Foreground>
								<LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
									<GradientStop Color="#FF1428F4" Offset="0"/>
									<GradientStop Color="#FF22C426" Offset="1"/>
								</LinearGradientBrush>
							</TextBox.Foreground>
						</TextBox>
						<!-- List box inherits its binding from the stack panel and use previously defined template "ItemTemplate" to display each item in the list-->
						<ListBox x:Name="videoListBox1" Width="290" Height="442" IsSynchronizedWithCurrentItem="True" ItemsSource="{Binding}" ItemTemplate="{StaticResource ItemTemplate}"
								 SelectedIndex="0" Canvas.Left="47" Canvas.Top="99.083" ScrollViewer.HorizontalScrollBarVisibility="Disabled" ScrollViewer.VerticalScrollBarVisibility="Hidden"
								 RenderTransformOrigin="1,1" HorizontalAlignment="Center" OverridesDefaultStyle="False" VerticalAlignment="Center" FontFamily="Comic Sans MS"
								 BorderThickness="0,0,0,0" Background="{DynamicResource DefaultedBorderBrush}" BorderBrush="{DynamicResource {x:Static SystemColors.MenuHighlightBrushKey}}">
							<ListBox.ItemContainerStyle>
								<Style TargetType="{x:Type ListBoxItem}">
									<Setter Property="Margin" Value="2" />
									<Setter Property ="BorderThickness" Value ="1"/>
									<Setter Property="HorizontalContentAlignment" Value="Left" />
									<Setter Property="VerticalContentAlignment" Value="Center" />
									<Setter Property="MaxWidth" Value="275" />
									<Setter Property="MaxHeight" Value="400" />
								</Style>
							</ListBox.ItemContainerStyle>
						</ListBox>
						<!-- Canvas binds to the selected item of "videoListBox1"-->
						<Canvas DataContext="{Binding Path=SelectedItem, ElementName=videoListBox1}" x:Name="canvasTwo">
							<MediaElement Width="423.631" Height="306.51" Canvas.Left="388.5" Canvas.Top="169.04" x:Name="mediaElement" LoadedBehavior="Manual" UnloadedBehavior="Manual" ScrubbingEnabled="True"
										  RenderTransformOrigin="0,0" HorizontalAlignment="Center" OverridesDefaultStyle="False" VerticalAlignment="Center">
								<MediaElement.Source>
									<!-- Media element is bound to the attribute of streaming element of content element-->
									<Binding Path="Element[{http://search.yahoo.com/mrss}content].Element[{http://search.yahoo.com/mrss}streaming].Attribute[url].Value"/>
								</MediaElement.Source>
								<MediaElement.RenderTransform>
									<TransformGroup>
										<ScaleTransform ScaleX="1" ScaleY="1"/>
										<SkewTransform AngleX="0" AngleY="0"/>
										<RotateTransform Angle="-0.069"/>
										<TranslateTransform X="0" Y="0"/>
									</TransformGroup>
								</MediaElement.RenderTransform>
							</MediaElement>
							<Image x:Name="videoImage" Width="378" Height="312" Canvas.Left="412" Canvas.Top="165.04" RenderTransformOrigin="0.5,0.5">
								<Image.Source>
									<Binding Path="Element[{http://search.yahoo.com/mrss}content].Element[{http://search.yahoo.com/mrss}thumbnail].Attribute[url].Value"/>
								</Image.Source>
								<Image.RenderTransform>
									<TransformGroup>
										<ScaleTransform ScaleX="1" ScaleY="1"/>
										<SkewTransform AngleX="0" AngleY="0"/>
										<RotateTransform/>
										<TranslateTransform X="0" Y="0"/>
									</TransformGroup>
								</Image.RenderTransform>
							</Image>
							<TextBlock HorizontalAlignment="Center" x:Name="titleTextBlock" VerticalAlignment="Center" Width="422" Height="62" Canvas.Left="390" Canvas.Top="99.04" FontSize="16" FontWeight="Bold" Foreground="#FFECEEF5" TextWrapping="Wrap" Text="{Binding Path=Element[title].Value}" TextAlignment="Center" FontFamily="Comic Sans MS"/>
						</Canvas>
						<Button x:Name="playButton" Width="75" Height="24" Content="Play" Canvas.Left="466.5" Canvas.Top="518.04" Click="OnPlay">
							<Button.Background>
								<LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
									<GradientStop Color="#FF7A7878" Offset="0.01"/>
									<GradientStop Color="#FFFFFFFF" Offset="1"/>
								</LinearGradientBrush>
							</Button.Background>
						</Button>
						<Button x:Name="stopButton" Width="75" Height="24" Content="Stop" Canvas.Left="564.5" Canvas.Top="518.04" Click="OnStop">
							<Button.Background>
								<LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
									<GradientStop Color="#FF6C6A6A" Offset="0"/>
									<GradientStop Color="#FFFFFFFF" Offset="1"/>
								</LinearGradientBrush>
							</Button.Background>
						</Button>
						<Label x:Name="myFavorites" Style="{DynamicResource SimpleLabel}" Width="80" Height="20" Content="My Favorites" Canvas.Left="239.5" Canvas.Top="54.04" MouseEnter="OnMouseEnter" MouseLeave="OnMouseLeave" MouseUp="OnMouseUp"/>
						<Label x:Name="mostRecent" Style="{DynamicResource SimpleLabel}" Width="76" Height="20" Content="Most Recent" Canvas.Left="332.5" Canvas.Top="54.04" MouseEnter="OnMouseEnter" MouseLeave="OnMouseLeave" MouseUp="OnMouseUp"/>
						<Label x:Name="mostViewed" Style="{DynamicResource SimpleLabel}" Width="80" Height="20" Content="Most Viewed" Canvas.Left="421.5" Canvas.Top="54.04" MouseEnter="OnMouseEnter" MouseLeave="OnMouseLeave" MouseUp="OnMouseUp"/>
						<Label x:Name="topFavorites" Style="{DynamicResource SimpleLabel}" Width="88" Height="20" Content="Top Favorites" Canvas.Left="514.5" Canvas.Top="54.04" MouseEnter="OnMouseEnter" MouseLeave="OnMouseLeave" MouseUp="OnMouseUp"/>
						<Label x:Name="topRated" Style="{DynamicResource SimpleLabel}" Width="64" Height="20" Content="Top Rated" Canvas.Left="606.5" Canvas.Top="54.04" MouseEnter="OnMouseEnter" MouseLeave="OnMouseLeave" MouseUp="OnMouseUp"/>
						<Button x:Name="addButton" Width="75" Height="24" Content="Add" Canvas.Left="665.5" Canvas.Top="518.04" Click="OnAdd" ToolTip="Add this video to MyFavorites">
							<Button.Background>
								<LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
									<GradientStop Color="#FF6A6868" Offset="0"/>
									<GradientStop Color="#FFFFFFFF" Offset="1"/>
								</LinearGradientBrush>
							</Button.Background>
						</Button>
						<Label HorizontalAlignment="Right" x:Name="searchLabel" VerticalAlignment="Bottom" Width="54" Height="27" Content="Search:" FontSize="14" Canvas.Left="278.5" Canvas.Top="16"/>
					</Canvas>
				</StackPanel>
			</TabItem>
			<TabItem x:Name="tabItemTwo" Style="{DynamicResource SimpleTabItem}" Header="Edit MyFavorites">
				<TabItem.Background>
					<LinearGradientBrush EndPoint="0,1" StartPoint="0,0">
						<GradientStop Color="#FFF3F3F3" Offset="0"/>
						<GradientStop Color="#FFEBEBEB" Offset="0.5"/>
						<GradientStop Color="#FFDDDDDD" Offset="0.5"/>
						<GradientStop Color="#FFD6D1D1" Offset="1"/>
					</LinearGradientBrush>
				</TabItem.Background>
				<!-- Stack panel uses resource "MyFavorites" defined earlier and binds to child elements with the name "item"-->
				<StackPanel x:Name="stackPanelTwo" Background="{DynamicResource DefaultedBorderBrush}" DataContext="{Binding Path=Elements[item], Source={StaticResource MyFavoritesList}}">
					<Canvas x:Name="canvasThree" Width="870" Height="573">
						<Image x:Name="msnLogo2" Width="Auto" Height="Auto" Canvas.Left="58" Canvas.Top="22" Source="msn_b.gif">
							<Image.OpacityMask>
								<LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
									<GradientStop Color="#FF000000" Offset="0"/>
									<GradientStop Color="#FFFFFFFF" Offset="1"/>
								</LinearGradientBrush>
							</Image.OpacityMask>
						</Image>
						<!-- List box inherits its binding from the stack panel-->
						<ListBox x:Name="videoListBox2" Width="290" Height="442" IsSynchronizedWithCurrentItem="True" ItemsSource="{Binding}" ItemTemplate="{StaticResource ItemTemplate}"
								 SelectedIndex="0" Canvas.Left="47" Canvas.Top="98.35" ScrollViewer.HorizontalScrollBarVisibility="Disabled" ScrollViewer.VerticalScrollBarVisibility="Hidden"
								 RenderTransformOrigin="1,1" HorizontalAlignment="Center" OverridesDefaultStyle="False" VerticalAlignment="Center" FontFamily="Comic Sans MS" BorderThickness="0,0,0,0"
								 Background="{DynamicResource DefaultedBorderBrush}" BorderBrush="{DynamicResource {x:Static SystemColors.MenuHighlightBrushKey}}">
							<ListBox.ItemContainerStyle>
								<Style TargetType="{x:Type ListBoxItem}">
									<Setter Property="Margin" Value="2" />
									<Setter Property ="BorderThickness" Value ="1"/>
									<Setter Property="HorizontalContentAlignment" Value="Center" />
									<Setter Property="VerticalContentAlignment" Value="Center" />
									<Setter Property="MaxWidth" Value="275" />
									<Setter Property="MaxHeight" Value="400" />
								</Style>
							</ListBox.ItemContainerStyle>
						</ListBox>
						<!-- Canvas binds to the selected item of "videoListBox2" and all child controls use that as the base element-->
						<Canvas DataContext="{Binding Path=SelectedItem, ElementName=videoListBox2}" x:Name="canvasFour">
							<TextBlock Canvas.Left="393" Canvas.Top="97.94" FontSize="16" Width="70" Height="32" Text="Title: " x:Name="titleText" FontFamily="Comic Sans MS" Foreground="#FFFAF8F8"/>
							<TextBlock Canvas.Left="509" Canvas.Top="97.94" FontSize="16" Width="309" Foreground="#FFFAF8F8" TextWrapping="Wrap" Text="{Binding Path=Element[title].Value}" x:Name="titelValue" FontFamily="Comic Sans MS" Height="43.377"/>
							<TextBlock Canvas.Left="393" Canvas.Top="145.317" FontSize="16" Width="79" Height="30" Text="Duration: " x:Name="durationText" FontFamily="Comic Sans MS" Foreground="#FFFAF8F8"/>
							<TextBlock Canvas.Left="509" Canvas.Top="145.317" FontSize="16" Width="95" Height="30" x:Name="durationValue" FontFamily="Comic Sans MS" Foreground="#FFFAF8F8">
								<TextBlock.Text>
									<Binding Path="Element[{http://soapbox.msn.com/elements/2005}duration].Value"/>
								</TextBlock.Text>
							</TextBlock>
							<TextBlock Canvas.Left="393" Canvas.Top="190" FontSize="16" Width="70" Height="20" Text="Views: " x:Name="viewsText" FontFamily="Comic Sans MS" Foreground="#FFFAF8F8"/>
							<TextBlock Canvas.Left="509" Canvas.Top="190" FontSize="16" Width="95" Height="20" x:Name="viewsValue" FontFamily="Comic Sans MS" Foreground="#FFFAF8F8">
								<TextBlock.Text>
									<Binding Path="Element[{http://soapbox.msn.com/elements/2005}playCount].Value"/>
								</TextBlock.Text>
							</TextBlock>
							<TextBlock Canvas.Left="393" Canvas.Top="226" FontSize="16" Width="79" Height="28" Text="Rating: " x:Name="ratingText" FontFamily="Comic Sans MS" Foreground="#FFFAF8F8"/>
							<TextBlock Canvas.Left="509" Canvas.Top="226" FontSize="16" Width="59" Height="28" x:Name="ratingValue" FontFamily="Calibri" Foreground="#FFFAF8F8">
								<TextBlock.Text>
									<Binding Path="Element[{http://soapbox.msn.com/elements/2005}rating].Value"/>
								</TextBlock.Text>
							</TextBlock>
							<TextBlock Canvas.Left="393" Canvas.Top="270" FontSize="16" Width="97" Height="30" Text="Category: " x:Name="categoryText" FontFamily="Comic Sans MS" Foreground="#FFFAF8F8"/>
							<TextBlock Canvas.Left="509" Canvas.Top="274.683" FontSize="16" Width="309" Height="35.317" x:Name="categoryValue" FontFamily="Comic Sans MS" Foreground="#FFFAF8F8">
								<TextBlock.Text>
									<Binding Path="Element[{http://soapbox.msn.com/elements/2005}category].Value"/>
								</TextBlock.Text>
							</TextBlock>
							<TextBlock Canvas.Left="393" Canvas.Top="315" FontSize="16" Width="97" Height="28" Text="Description: " x:Name="descText" FontFamily="Comic Sans MS" Foreground="#FFFAF8F8"/>
							<TextBox Canvas.Left="509" Canvas.Top="315" FontSize="16" Width="309" Height="171" Background="cornsilk" TextWrapping="Wrap" x:Name="descValue" ToolTip="Edit the video description" FontFamily="Comic Sans MS" Foreground="#FF000000">
								<TextBox.Text>
									<Binding Path="Element[{http://soapbox.msn.com/elements/2005}description].Value"/>
								</TextBox.Text>
							</TextBox>
						</Canvas>
						<Button Canvas.Left="403" Canvas.Top="519.04" Width="75" Height="23" FontSize="11" Click="OnDelete" x:Name="deleteButton" ToolTip="Delete this video from MyFavorites" Content="Delete">
							<Button.Background>
								<LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
									<GradientStop Color="#FF8C8888" Offset="0"/>
									<GradientStop Color="#FFFFFFFF" Offset="1"/>
								</LinearGradientBrush>
							</Button.Background>
						</Button>
						<TextBlock HorizontalAlignment="Center" x:Name="tab2TitleText" VerticalAlignment="Center" Width="422" Height="40" FontFamily="Comic Sans MS" FontSize="18" FontStyle="Normal" FontWeight="Bold" Text="Edit description or delete from MyFavorites" TextAlignment="Center" TextWrapping="Wrap" Canvas.Left="288" Canvas.Top="26.04"/>
					</Canvas>
				</StackPanel>
			</TabItem>
		</TabControl>
	</Grid>
</Window>